<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>flex基础1</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<style type="text/css">
			.container{
				/*声明使用flex布局,item会横向排列*/
				display: flex;		
				height: 200px;
			}
			.item{
				width: 100px;	/*固定宽度*/
				text-align: center;		/*文字居中*/
				background: #129FEA;
				height: 50px;
				line-height: 50px;
			}
		</style>
	</head>
	<body>
		<div class="container">
			<div class="item">item1</div>
			<div class="item">item2</div>
			<div class="item">item3</div>
			<div class="item">item4</div>
			<div class="item">item5</div>
		</div>
	</body>
</html>
